<template>
	<div class="top">
		<h1 class="title">猜你喜欢</h1>
		<div class="box">
			<div class="content">
				<div>
					<img
						src=" https://imgservice.suning.cn/uimg1/b2c/image/19l9gXVTnGHrK71NGPzKfg.jpg_374w_374h_4e_200w_200h_4e"
						alt=""
					/>
				</div>
				<p>¥939.00</p>
				<p>荣耀畅玩20 6GB+128GB 幻夜黑 5000mAh超大电池续航 6.5英寸</p>

				<footer>
					<button class="iconfont icon-gouwuche">加入购物车</button>
				</footer>
			</div>
			<div class="content">
				<div>
					<img
						src="https://imgservice.suning.cn/uimg1/b2c/image/19l9gXVTnGHrK71NGPzKfg.jpg_374w_374h_4e_200w_200h_4e"
						alt=""
					/>
				</div>
				<p>¥939.00</p>
				<p>荣耀畅玩20 6GB+128GB 幻夜黑 5000mAh超大电池续航 6.5英寸</p>

				<footer>
					<button class="iconfont icon-gouwuche">加入购物车</button>
				</footer>
			</div>
			<div class="content">
				<div>
					<img
						src="https://imgservice.suning.cn/uimg1/b2c/image/19l9gXVTnGHrK71NGPzKfg.jpg_374w_374h_4e_200w_200h_4e"
						alt=""
					/>
				</div>
				<p>¥939.00</p>
				<p>荣耀畅玩20 6GB+128GB 幻夜黑 5000mAh超大电池续航 6.5英寸</p>

				<footer>
					<button class="iconfont icon-gouwuche">加入购物车</button>
				</footer>
			</div>
			<div class="content">
				<div>
					<img
						src="https://imgservice.suning.cn/uimg1/b2c/image/19l9gXVTnGHrK71NGPzKfg.jpg_374w_374h_4e_200w_200h_4e"
						alt=""
					/>
				</div>
				<p>¥939.00</p>
				<p>荣耀畅玩20 6GB+128GB 幻夜黑 5000mAh超大电池续航 6.5英寸</p>

				<footer>
					<button class="iconfont icon-gouwuche">加入购物车</button>
				</footer>
			</div>
			<div class="content">
				<div>
					<img
						src="https://imgservice.suning.cn/uimg1/b2c/image/19l9gXVTnGHrK71NGPzKfg.jpg_374w_374h_4e_200w_200h_4e"
						alt=""
					/>
				</div>
				<p>¥939.00</p>
				<p>荣耀畅玩20 6GB+128GB 幻夜黑 5000mAh超大电池续航 6.5英寸</p>

				<footer>
					<button class="iconfont icon-gouwuche">加入购物车</button>
				</footer>
			</div>
			<div class="content">
				<div>
					<img
						src="https://imgservice.suning.cn/uimg1/b2c/image/BUJfmi7979TagqmBEYFTuw.jpg_200w_200h_4e"
						alt=""
					/>
				</div>
				<p>¥939.00</p>
				<p>荣耀畅玩20 6GB+128GB 幻夜黑 5000mAh超大电池续航 6.5英寸</p>

				<footer>
					<button class="iconfont icon-gouwuche">加入购物车</button>
				</footer>
			</div>
			<div class="content">
				<div>
					<img
						src="https://imgservice.suning.cn/uimg1/b2c/image/BUJfmi7979TagqmBEYFTuw.jpg_200w_200h_4e"
						alt=""
					/>
				</div>
				<p>¥939.00</p>
				<p>荣耀畅玩20 6GB+128GB 幻夜黑 5000mAh超大电池续航 6.5英寸</p>

				<footer>
					<button class="iconfont icon-gouwuche">加入购物车</button>
				</footer>
			</div>
			<div class="content">
				<div>
					<img
						src="https://imgservice.suning.cn/uimg1/b2c/image/BUJfmi7979TagqmBEYFTuw.jpg_200w_200h_4e"
						alt=""
					/>
				</div>
				<p>¥939.00</p>
				<p>荣耀畅玩20 6GB+128GB 幻夜黑 5000mAh超大电池续航 6.5英寸</p>

				<footer><button class="icon-gouwuche">加入购物车</button></footer>
			</div>
			<div class="content">
				<div>
					<img
						src="https://imgservice.suning.cn/uimg1/b2c/image/cRU8TB1KI9Pm1Kts9xGYaA.jpg_200w_200h_4e"
						alt=""
					/>
				</div>
				<p>¥939.00</p>
				<p>荣耀畅玩20 6GB+128GB 幻夜黑 5000mAh超大电池续航 6.5英寸</p>

				<footer>
					<button class="iconfont icon-gouwuche">加入购物车</button>
				</footer>
			</div>
		</div>
	</div>
</template>

<script>
export default {
	name: "goodsShow",
}
</script>

<style lang="less" scoped>
.top {
	margin-top: 40px;
}
.title {
	font-size: 30px;
	margin-left: 180px;
}
.box {
	width: 1148px;
	margin: 0 auto;
	border: 1px #f3f0eb solid;
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	// margin-top: 40px;
	margin-bottom: 40px;
	.content {
		width: 228px;
		height: 302px;
		p {
			text-align: center;
		}
		footer {
			width: 228px;
			height: 35px;
			button {
				display: block;
				margin: 0 auto;
				height: 32px;
				width: 178px;
			}
		}
	}
}
</style>
